<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/index.css">
    <link rel="stylesheet" href="./css/swiper.min.css">
    <script src="./js/swiper.min.js"></script>
</head>
<body>
    <!-- 头部开始 -->
    <header>
        <div class="dizhi">
                <select>
                        <option value ="上海">上海</option>
                        <option value ="上海">上海</option>
                        <option value="上海">上海</option>
                        <option value="上海">上海i</option>
                      </select>
        </div>
        <h2>驴妈妈旅游网</h2>
        <div class="denglu"><a href="javascript:;"><img src="./icon/my.png" alt=""></a></div>
    </header>
    <!-- 头部结束 -->
    <!-- 轮播图 -->
    <div class="swiper-container" style="overflow: hidden;">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="./images/banner1.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./images/banner2.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./images/banner3.jpg" alt=""></div>
                <div class="swiper-slide"><img src="./images/banner4.jpg" alt=""></div>
            </div>
        </div>
        <!-- 轮播图结束 -->
        <div class="jingdian">
            <img src="./icon/nav1.png" alt="">
            <img src="./icon/nav2.png" alt="">
            <img src="./icon/nav3.png" alt="">
            <img src="./icon/nav4.png" alt="">
            <img src="./icon/nav5.png" alt="">
            <img src="./icon/nav6.png" alt="">
        </div>

        <div class="jipiao">
            <img src="./icon/j1.png" alt="">
            <img src="./icon/j2.png" alt="">
            <img src="./icon/j3.png" alt="">
            <img src="./icon/j4.png" alt="">
            <img src="./icon/j5.png" alt="">
            <img src="./icon/j6.png" alt="">
            <img src="./icon/j7.png" alt="">
            <img src="./icon/j8.png" alt="">
        </div>

        <div class="qinzi">
            <img src="./images/t1.jpg" alt="" class="img1">
            <div class="qinzi2">
                <img src="./images/t2.jpg" alt="" class="img2">
                <img src="./images/t3.jpg" alt="" class="img3">
            </div>
        </div>
        <!-- 热门活动 -->
        <div class="remen">
            <span>热门活动</span>
            <img src="./images/r1.jpg" alt="">
            <img src="./images/r2.jpg" alt="">
            <img src="./images/r3.jpg" alt="">
            <img src="./images/r4.jpg" alt="">
        </div>

        <!-- 度假 -->
        <div class="dujia">
            <span class="duzhoumo">度周末</span>
            <span>度长假</span>
            <img src="./images/zm1.jpg" alt="">
            <p>[热门活动]门票元旦欢</p>
            <p>听音乐,泡温泉,就找驴妈妈,泉新玩法,5折整点秒杀,立减高达100元.</p>
            <img src="./images/zm2.jpg" alt="">
            <p>[热门活动]门票元旦欢</p>
            <p>听音乐,泡温泉,就找驴妈妈,泉新玩法,5折整点秒杀,立减高达100元.</p>
            <img src="./images/zm3.jpg" alt="">
            <p>[热门活动]门票元旦欢</p>
            <p>听音乐,泡温泉,就找驴妈妈,泉新玩法,5折整点秒杀,立减高达100元.</p>
            <img src="./images/zm4.jpg" alt="">
            <p>[热门活动]门票元旦欢</p>
            <p>听音乐,泡温泉,就找驴妈妈,泉新玩法,5折整点秒杀,立减高达100元.</p>
            <img src="./images/zm5.jpg" alt="">
            <p>[热门活动]门票元旦欢</p>
            <p>听音乐,泡温泉,就找驴妈妈,泉新玩法,5折整点秒杀,立减高达100元.</p>

        </div>

        <h3 class="chakan">查看更多</h3>

        <div class="zhuce">
            <span class="s1"><a href="javascript:;">免费注册</a></span>
            <span class="s2"><a href="javascript:;">登录</a></span>
            <span class="s3"><a href="javascript:;">TOP</a></span>
        </div>

        <script src="../dist/js/swiper.min.js"></script>    
        <script>
           var swiper = new Swiper('.swiper-container');
         </script>   
</body>
</html>